<template>
	<view class="my page">
		<view class="top">
			<view class="info">
				<image class="avatar" :src="userInfo.avatar" mode=""></image>
				<view class="user-info">
					<text class="name">{{userInfo.name}}</text>
					<text class="code">{{userInfo.code}}</text>	
				</view>
				<view class="update">
					<text class="txt">{{level.name}}</text>
					<text class="iconfont iconhuiyuan"></text>
				</view>
			</view>
		<view class="account">
			<view class="item">
				<text class="val">{{CEC}}</text>
				<text class="name">存储金</text>
			</view>
			<view class="item">
				<text class="val">{{POINT}}</text>
				<text class="name">积分点</text>
			</view>
			<view class="item">
				<text class="val">0.00</text>
				<text class="name">经验值</text>
			</view>
		</view>
		</view>
		
		<view class="block order">
			<view class="title" >
				<text class="name">订单管理</text>
				<text class="iconfont iconarrow_right"></text>
			</view>
			<view class="items">
				
				<view class="item" :key="index"  @click="toMallOrder(index)" v-for="(item,index) in orderFilters">
					<text class="iconfont" :class="item.icon"></text>
					<text class="name">{{item.name}}</text>
				</view>
				<!-- <view class="item" @click="toMallAddress">
						<text class="iconfont icondizhiguanli"></text>
						<text class="name">地址管理</text>
					</view> -->
				<!-- <view class="item">
					<text class="iconfont"></text>
					<text class="name">待付款</text>
				</view>
				<view class="item">
					<text class="iconfont"></text>
					<text class="name">待发货</text>
				</view>
				<view class="item">
						<text class="iconfont icondizhiguanli"></text>
						<text class="name">地址管理</text>
					</view> -->
			<!-- 	<view class="item">
					<text class="iconfont icondaishouhuo"></text>
					<text class="name">代收货</text>
				</view>
				<view class="item">
					<text class="iconfont"></text>
					<text class="name">退款/售后</text>
				</view> -->
			</view>
		</view>
		
		
		

		
		<view class="btns">
			
			<view class="item" @click="toMallAddress">
				<text class="name">地址管理</text>
				<text class="iconfont iconarrow_right"></text>
			</view>
			
			<view class="item" @click="account">
				<text class="name">账户记录</text>
				<text class="iconfont iconarrow_right"></text>
			</view>
			
			<view class="item" @click="recharge">
				<text class="name">会员充值</text>
				<text class="iconfont iconarrow_right"></text>
			</view>
			
			<view class="item" @click="friend">
				<text class="name">我的推广</text>
				<text class="iconfont iconarrow_right"></text>
			</view>
			
		
			
		</view>
		
<!-- 		<view class="block order">
			<view class="title">
				<text class="name">堂食板块</text>
				<text class="iconfont"></text>
			</view>
			<view class="items">
				<view class="item">
					<text class="iconfont iconziyuan"></text>
					<text class="name">待付款</text>
				</view>
			</view>
		</view> -->
		
		
		
	</view>
</template>

<script>
	import {getUserInfo} from '@/api/user.js'
	export default {
		created() {
			
		},
		methods:{
			friend(){
				this.$Router.push("/pages/user/user")
			},
			recharge(){
				this.$Router.push("/pages/account/recharge")
			},
			account(){
				this.$Router.push("/pages/account/record")
			},
			toSaleOrder(index){
				if(index ==0){
					this.status = null
					this.paid = null
				}
				if(index == 1){ //未支付
					this.paid = 0
				}
				if(index == 2){ //已支付 未发货
					this.paid = 1
					this.status = 0
				}
				if(index == 3){ //已支付 已发货
					this.paid = 1
					this.status = 2
				}
				this.$Router.push({
					path:"/pages/sale/order/index",
					query:{status:this.status,paid:this.paid,index:index}
				})
			},
			toMallAddress(){
				this.$Router.push({
					path:"/pages/address/address",
					query:{edit:true}
				})
			},
			toSaleAddress(){
				this.$Router.push({
					path:"/pages/sale/address",
					query:{edit:true}
				})
			},
			toMallOrder(index){
				if(index ==0){
					this.status = null
					this.paid = null
				}
				if(index == 1){ //未支付
					this.paid = 0
				}
				if(index == 2){ //已支付 未发货
					this.paid = 1
					this.status = 0
				}
				if(index == 3){ //已支付 已发货
					this.paid = 1
					this.status = 2
				}
				this.$Router.push({
					path:"/pages/mall/order/index",
					query:{status:this.status,paid:this.paid,index:index}
				})
			}
		},
		onShow() {
			getUserInfo().then(res => {
				this.userInfo = res.data
				this.level = res.extra.level
				this.accounts = res.extra.accounts
				this.accounts.forEach(ac=>{
					if(ac.type==0){
						this.CEC = ac.amount
					}
					if(ac.type==1){
						
						this.POINT = ac.amount
					}
				})
				
			})
		},
		data() {
			return {
				orderFilters:[{name:"全部",icon:"iconquanbudingdan"},{name:"待支付",icon:"iconziyuan"},{name:"未发货",icon:"icondaifahuo"},{name:"已发货",icon:"iconpeisong"}],
				saleFilters:[{name:"全部",icon:"iconquanbudingdan"},{name:"待支付",icon:"iconziyuan"},{name:"未配送",icon:"icondaifahuo"}],
				userInfo:{},
				level:{},
				accounts:[],
				CEC:0.00,
				POINT:0.00
			};
		}
	}
</script>

<style lang="stylus">
	.my
		background url(../../static/hbg.png) no-repeat
		background-size 100% auto
		background-color #EFEFEF
		padding-bottom 20upx
		padding 0 20upx 20upx
		.top
			background:rgba(255,255,255,1);
			border-radius:10upx;
			.info
				height 164upx
				border-bottom 1upx dotted rgba(215,214,209,1);
				display flex
				align-items center
				padding 0 50upx
				.avatar
					width:96upx;
					height:96upx;
					border-radius:50%;
					margin-right 20upx
				.user-info
					flex 1
					display flex
					justify-content center
					flex-direction column
					.name
						font-size 28upx
						color #6F6F6F
					.code
						color #A1A1A1
						font-size 20upx
						margin-top 10upx
				.update
					display flex
					align-items center
					justify-content center
					.txt
						color #6F6F6F
						font-size 24upx
					.iconfont
						margin-left 10upx
						color #F1C40F
			.account
				height 143upx
				display flex
				justify-content space-around
				.item
					display flex
					align-items center
					justify-content center
					flex-direction column
					.name
						font-size 20upx
						color #A1A1A1
					.val
						color #FF6D23
						font-size 28upx
		.block
			background:rgba(255,255,255,1);
			border-radius:10upx;
			margin-top 20upx
			.title
				height 74upx
				display flex
				align-items center
				justify-content space-between
				padding 0 23upx
				border-bottom 1px solid #EFEFEF
				.name
					color #6F6F6F
					font-size 24upx
				.iconfont
					font-size 20upx
					color #B9B5B5
			.items
				height 125upx
				display flex
				align-items center
				.item
					flex 1
					display flex
					align-items center
					flex-direction column
					.name
						color #616977
						font-size 22upx
					.iconfont
						color #757575
						font-size 44upx
						margin-top 11upx
		.btns
			.item
				height:88upx;
				background:rgba(255,255,255,1);
				border-radius:10upx;
				display flex
				align-items center
				justify-content space-between
				padding 0 20upx
				margin-bottom 20upx
				&:first-child
					margin-top 20upx
				.name
					color #616977
					font-size 24upx
				.iconfont
					font-size 20upx
					color #A9B1C0
					
</style>
